<!-- 后台博客管理 -->
<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
	<head th:replace="admin/_fragments :: head(~{::title})">
		<meta charset="utf-8">
		<!-- 设置移动端比例 -->
		<meta name="viewport" content="width=device-width,initial-scale=1.0">
		<title>博客登录管理</title>
		<!-- CDN的css引入 -->
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.2.10/semantic.min.css">
		
		<!-- 引入自定义的css -->
		<link rel="stylesheet" href="../../static/css/me.css" />
	</head>
	<body>

		<div class="m-container-small m-padded-tb-massive" style="max-width: 30em !important;">
			<div class="ur container">
				<div class="ui middle aligned center aligned grid">
					<div class="column">
						<h2 class="ui teal image header">
<!--							<img src="assets/images/logo.png" class="image">-->
							<img src="https://semantic-ui.com/examples/assets/images/logo.png" class="image">
							<div class="content">
								管理后台登录
							</div>
						</h2>
						<form class="ui large form" method="post" action="#" th:action="@{/admin/login}">
							<div class="ui segment">
								<div class="field">
									<div class="ui left icon input">
										<i class="user icon"></i>
										<input type="text" name="username" placeholder="用户名">
									</div>
								</div>
								<div class="field">
									<div class="ui left icon input">
										<i class="lock icon"></i>
										<input type="password" name="password" placeholder="密码">
									</div>
								</div>
								<button class="ui fluid large teal submit button">登   录</button>
							</div>

							<div class="ui mini error message"></div>
							<div class="ui mini negative message" th:unless="${#strings.isEmpty(message)}" th:text="${message}">用户名密码错误</div>

						</form>
<!--注册目前先不用-->
<!--						<div class="ui message">-->
<!--							New to us? <a href="#">Sign Up</a>-->
<!--						</div>-->
					</div>
				</div>
			</div>
		</div>


		<!--/*/<th:block th:replace="_fragments :: script">/*/-->
		<!-- CDN依赖于jquery，所以要引入jquery -->
		<script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>
		<!-- CDN的js引入 -->
		<script src="https://cdn.jsdelivr.net/semantic-ui/2.2.10/semantic.min.js"></script>
		<!--/*/</th:block>/*/-->

<!--		验证账户密码-->
	<script>
		$('.ui.form').form({
			fields : {
				username:{
					identifier:'username',
					rules:[{
						type:'empty',
						prompt:'请输入用户名'
					}]
				},
				password:{
					identifier:'password',
					rules:[{
						type:'empty',
						prompt:'请输入密码'
					}]
				}
			}

		});
	</script>
	</body>
</html>
